<template>
  <div class="app-container">
    <!-- 搜索 -->
    <salarylist-search
      :init-params="initParams"
      :search-params="searchKey"
      :department-all-list-data="departmentAllListData"
      :job-all-list-data="jobAllListData"
      :employee-post-level-list-data="employeePostLevelListData"
      :employee-company-list-data="employeeCompanyListData"
      :list-plate-block-data="listPlateBlockData"
      @on-init="handleInitList"
      @on-export="handleExport"
      @on-export2="handleExport2"
    />
    <!-- 列表 -->
    <salarylist-table
      :data="listData"
      :search-params="searchKey"
      :total-count="totalCount"
      :list-loading="listLoading"
      @on-init="handleInitList"
    />
  </div>
</template>

<script>
import { getSalarylistListAPI, exportSalarylistListAPI, exportSalarylistListAPI2 } from '@/api/todo/salarylist'
import { SalarylistSearch, SalarylistTable } from './components'
import commonMixins from '@/mixins/common'
import treeAllListData from '@/mixins/treeAllListData'

export default {
  name: 'SalarylistList',
  components: {
    SalarylistSearch,
    SalarylistTable
  },
  mixins: [commonMixins, treeAllListData],
  props: {},
  data() {
    return {
      initParams: { // 初始化参数
        pageNum: 1, // 当前页数
        pageSize: 10, // 每页个数
        sort: '', // 排序
        employeeName: '', // 员工姓名
        employeeStatus: '', // 员工状态
        salaryDate: '', // 发放月份
        // deptId: null, // 部门
        deptIds: [], // 多部门
        postIds: [], // 职务
        payBusinessInsurance: '', // 是否缴纳商业险
        salaryRange: '', // 工资范围
        entrySelectedDate: [], // 入职日期
        dimissionSelectedDate: [], // 离职日期
        salaryType: ''
        /* openingBank: '', // 开户行
          socialInsurancePlace: '', // 社保缴纳地
          realSalaryFrom: '', // 工资最小值
          realSalaryTo: '' // 工资最大值 */
      },
      searchKey: {}, // 搜索参数
      totalCount: 0, // 分页用的列表总条数
      listLoading: false,
      listData: [] // 列表数据
    }
  },
  computed: {},
  watch: {
    initParams: {
      handler: function(newVal, oldVal) {
        if (JSON.stringify(newVal) !== JSON.stringify(this.searchKey)) {
          this.searchKey = JSON.parse(JSON.stringify(newVal))
        }
      },
      deep: true,
      immediate: true
    }
  },
  created() {
  },
  mounted() {
    this.initData()
  },
  methods: {
    handleInitList(params = {}) { // 初始化列表
      this.searchKey = {
        ...this.searchKey,
        ...params
      }
      this.getListData()
    },
    handleExport(params = {}) { // 导出按钮操作
      const searchKey = {
        ...this.searchKey,
        ...params,
        ...{
          postLevelList: this.searchKey.postLevelList && this.searchKey.postLevelList.join(','),
          companys: this.searchKey.companys && this.searchKey.companys.join(','),
          plateBlocks: this.searchKey.plateBlocks && this.searchKey.plateBlocks.join(',')
        }
      }

      if (!searchKey.salaryDate) {
        this.$notify.error({
          title: '错误',
          message: '导出之前请选择发放月份！'
        })
        return
      }

      this.$confirm('是否确认导出所选月份的所有数据?', '警告', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        dangerouslyUseHTMLString: true
      }).then(async() => {
        try {
          const response = await exportSalarylistListAPI({
            ...searchKey,
            ...{
              deptIds: searchKey.deptIds.join(','),
              postIds: searchKey.postIds.join(','),
              entrySelectedDate: '',
              dimissionSelectedDate: '',
              onboardingDate: searchKey.entrySelectedDate ? searchKey.entrySelectedDate[0] : '',
              onboardingDate2: searchKey.entrySelectedDate ? searchKey.entrySelectedDate[1] : '',
              leaveDate: searchKey.dimissionSelectedDate ? searchKey.dimissionSelectedDate[0] : '',
              leaveDate2: searchKey.dimissionSelectedDate ? searchKey.dimissionSelectedDate[1] : ''
            }
          })
          this.downloadFile(response)
        } catch (error) {
          // console.log(error)
          this.$notify.error({
            title: '错误',
            message: error.message || '操作失败！'
          })
        }
      }).catch(() => {
      })
    },
    handleExport2(params = {}) { // 导出按钮操作
      const searchKey = {
        ...this.searchKey,
        ...params,
        ...{
          postLevelList: this.searchKey.postLevelList && this.searchKey.postLevelList.join(','),
          companys: this.searchKey.companys && this.searchKey.companys.join(','),
          plateBlocks: this.searchKey.plateBlocks && this.searchKey.plateBlocks.join(',')
        }
      }

      if (!searchKey.salaryDate) {
        this.$notify.error({
          title: '错误',
          message: '导出之前请选择发放月份！'
        })
        return
      }

      this.$confirm('是否确认导出所选月份的所有数据?', '警告', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        dangerouslyUseHTMLString: true
      }).then(async() => {
        try {
          const response = await exportSalarylistListAPI2({
            ...searchKey,
            ...{
              deptIds: searchKey.deptIds.join(','),
              postIds: searchKey.postIds.join(','),
              entrySelectedDate: '',
              dimissionSelectedDate: '',
              onboardingDate: searchKey.entrySelectedDate ? searchKey.entrySelectedDate[0] : '',
              onboardingDate2: searchKey.entrySelectedDate ? searchKey.entrySelectedDate[1] : '',
              leaveDate: searchKey.dimissionSelectedDate ? searchKey.dimissionSelectedDate[0] : '',
              leaveDate2: searchKey.dimissionSelectedDate ? searchKey.dimissionSelectedDate[1] : ''
            }
          })
          this.downloadFile(response)
        } catch (error) {
          // console.log(error)
          this.$notify.error({
            title: '错误',
            message: error.message || '操作失败！'
          })
        }
      }).catch(() => {
      })
    },
    async getListData() { // 获取列表数据
      try {
        const { searchKey } = this
        this.listLoading = true
        const response = await getSalarylistListAPI({
          ...searchKey,
          ...{
            deptIds: searchKey.deptIds.join(','),
            postIds: this.searchKey.postIds.join(','),
            entrySelectedDate: '',
            dimissionSelectedDate: '',
            onboardingDate: this.searchKey.entrySelectedDate ? this.searchKey.entrySelectedDate[0] : '',
            onboardingDate2: this.searchKey.entrySelectedDate ? this.searchKey.entrySelectedDate[1] : '',
            leaveDate: this.searchKey.dimissionSelectedDate ? this.searchKey.dimissionSelectedDate[0] : '',
            leaveDate2: this.searchKey.dimissionSelectedDate ? this.searchKey.dimissionSelectedDate[1] : '',
            postLevelList: this.searchKey.postLevelList && this.searchKey.postLevelList.join(','),
            companys: this.searchKey.companys && this.searchKey.companys.join(','),
            plateBlocks: this.searchKey.plateBlocks && this.searchKey.plateBlocks.join(',')
          }
        })
        const result = response
        if (+result.code === 200) {
          this.listData = result.rows || []
          this.totalCount = result.total || 0
        } else {
          this.$notify.error({
            title: '错误',
            message: result.msg || '获取列表失败！'
          })
        }
      } catch (error) {
        // console.log(error)
        this.$notify.error({
          title: '错误',
          message: error.message || '获取列表失败!'
        })
      } finally {
        this.listLoading = false
      }
    },
    async initData() { // 初始化数据
      this.getListData()
      this.getJobAllListData()
      this.getDepartmentAllListData()
      this.getEmployeeCompanyList()
      this.GetEmployeePostLevelList()
      this.getAllListPlateBlockData()
    }
  }
}
</script>

<style lang="scss" scoped>
  .app-container {
    &-left {
      width: 255px;
      float: left;
    }

    &-right {
      margin-left: 260px;
    }
  }
</style>
